<template>
  <div>
 
		<div class="personal_center_top">
      <router-link to="/personalInfo">
  			<div class="left width150 text_right margin_t50">
  				<img :src="src+userInfo.photo" />
  			</div>
      </router-link>
      <router-link to="/personalInfo">
  			<div class="left width150 margin_t60 f_color_white margin_lf10">
  				<div class="f_size26 text_center">
  					{{userInfo.username}}
  				</div>
  				<div class="text_center width_100 f_size20 bgd_color_btn1 border_radius20">
  					{{userInfo.roleTitle}}
  				</div>
  			</div>
      </router-link>
			<div v-show="isShop" class="right margin_t60 margin_lf20" style="padding-right: 35px">
        <router-link to="/applyshop">
  				<div class="margin_t10 f_size22 f_color_white">
  					申请开通店铺 &gt;
  				</div>
        </router-link>
			</div>
		</div>
		<div class="personal_center_container bgd_color_gray padding_b170">
			<div class="line_height80 border_bot1 f_size26 overflow_hide pad_lr26 bgd_color_white">
				<div class="left margin_rg20">
					<img src="../static/images/center_order_icon.png" />
				</div>
				<div class="left f_color_0">
					我的订单
				</div>
        <router-link :to="{name: 'Order', query: {sta: 0}}">
  				<div class="right f_color_gray">
  					查看全部订单
  				</div>
        </router-link>
			</div>
			<div class="height110 overflow_hide margin_bot14 bgd_color_white">
        <router-link :to="{name: 'Order', query: {sta: 1}}">
  				<div class="left width25 text_center f_size22">
  					<div class="margin_t10 position_rel">
  						<img src="../static/images/fukuang_icon.png" />
              <div v-show="fukuan_num_show" class="good_num_cir">
  							{{fukuan_num}}
  						</div>
  					</div>
  					<div class="">
  						待付款
  					</div>
  				</div>
        </router-link>
        <router-link :to="{name: 'Order', query: {sta: 2}}">
  				<div class="left width25 text_center f_size22">
  					<div class="margin_t10 position_rel">
  						<img src="../static/images/fahuo_icon.png" />
              <div v-show="fahuo_num_show" class="good_num_cir">
  							{{fahuo_num}}
  						</div>
  					</div>
  					<div class="">
  						待发货
  					</div>
  				</div>
        </router-link>
        <router-link :to="{name: 'Order', query: {sta: 3}}">
  				<div class="left width25 text_center f_size22">
  					<div class="margin_t10 position_rel">
  						<img src="../static/images/shouhuo_icon.png" />
              <div v-show="shouhuo_num_show" class="good_num_cir">
  							{{shouhuo_num}}
  						</div>
  					</div>
  					<div class="">
  						待收货
  					</div>
  				</div>
        </router-link>
        <router-link :to="{name: 'Order', query: {sta: 4}}">
  				<div class="left width25 text_center f_size22">
  					<div class="margin_t10 position_rel">
  						<img src="../static/images/pingjia_icon.png" />
              <div v-show="pingjia_num_show" class="good_num_cir">
  							{{pingjia_num}}
  						</div>
  					</div>
  					<div class="">
  						待评价
  					</div>
  				</div>
        </router-link>
			</div>
      <router-link to="/myAccount">
  			<div class="line_height100 overflow_hide border_bot1 f_size26 pad_lr26 bgd_color_white">
  				<div class="left margin_rg20">
  					<img src="../static/images/account_icon.png" />
  				</div>
  				<div class="left f_color_0">
  					我的账户
  				</div>
  				<div class="right f_color_gray position_rel arrow_right pad_rg20">
  					￥{{userInfo.amount}}
  				</div>
  			</div>
      </router-link>
      <router-link to="/cooperation">
  			<div class="line_height100 overflow_hide border_bot1 f_size26 pad_lr26 bgd_color_white">
  				<div class="left margin_rg20">
  					<img src="../static/images/hezuohuoban_icon.png" />
  				</div>
  				<div class="left f_color_0">
  					我的合作伙伴
  				</div>
  				<div class="right f_color_gray position_rel arrow_right pad_rg20">
  					查看
  				</div>
  			</div>
      </router-link>
      <router-link to="/manageAddress">
  			<div class="line_height100 overflow_hide border_bot1 f_size26 pad_lr26 bgd_color_white">
  				<div class="left margin_rg20">
  					<img src="../static/images/dizhiguanli_icon.png" />
  				</div>
  				<div class="left f_color_0">
  					地址管理
  				</div>
  				<div class="right f_color_gray position_rel arrow_right pad_rg20">

  				</div>
  			</div>
      </router-link>
      <router-link to="/modifyPassword">
  			<div class="line_height100 overflow_hide border_bot1 f_size26 pad_lr26 bgd_color_white">
  				<div class="left margin_rg20">
  					<img src="../static/images/guanlimima _icon.png" />
  				</div>
  				<div class="left f_color_0">
  					密码管理
  				</div>
  				<div class="right f_color_gray position_rel arrow_right pad_rg20">

  				</div>
  			</div>
      </router-link>
      <router-link to="/bankInfo">
  			<div class="line_height100 overflow_hide border_bot1 f_size26 pad_lr26 bgd_color_white margin_bt20">
  				<div class="left margin_rg20">
  					<img class="img_icon" src="../static/images/yinhangkaxinxi_icon.png" />
  				</div>
  				<div class="left f_color_0">
  					银行卡信息
  				</div>
  				<div class="right f_color_gray position_rel arrow_right pad_rg20">

  				</div>
  			</div>
      </router-link>
      <router-link to="/about">
  			<div class="line_height100 overflow_hide border_bot1 f_size26 pad_lr26 bgd_color_white">
  				<div class="left margin_rg20">
  					<img src="../static/images/guanyuwomen_icon.png" />
  				</div>
  				<div class="left f_color_0">
  					关于我们
  				</div>
  				<div class="right f_color_gray position_rel pad_rg20">

  				</div>
  			</div>
      </router-link>
			<div @click="tuichu" class="line_height100 overflow_hide border_bot1 f_size26 pad_lr26 bgd_color_white">
				<div class="left margin_rg20">
					<img src="../static/images/tuichu_icon.png" />
				</div>
				<div class="left f_color_0">
					退出
				</div>
				<div class="right f_color_gray position_rel pad_rg20">

				</div>
			</div>
		</div>
    <div class="height100 f_size22 box_size_border position_fixed width100 text_center bottom0 bgd_color_white">
      <router-link to="/">
        <div class="left width25">
  				<div class="">
  					<img class="width44 margin_t10" src="../static/images/shouye_icon0.png"/>
  				</div>
  				<div class="f_color_0">
  					首页
  				</div>
  			</div>
      </router-link>
      <router-link to="order">
  			<div class="bottom_item left width25 active">
  				<div class="">
  					<img class="width44 margin_t10" src="../static/images/order_b_icon0.png"/>
  				</div>
  				<div class="f_color_0">
  					订单
  				</div>
  			</div>
      </router-link>
      <router-link to="/shopcar">
  			<div class="left width25">
  				<div class="">
  					<img class="width44 margin_t10" src="../static/images/shopping_car_b_icon0.png"/>
  				</div>
  				<div class="f_color_0">
  					购物车
  				</div>
  			</div>
      </router-link>
      <router-link to="/set">
  			<div class="left width25">
  				<div class="">
  					<img class="width44 margin_t10" src="../static/images/set_b_icon0.png"/>
  				</div>
  				<div class="f_color_0">
  					设置
  				</div>
  			</div>
      </router-link>
		</div>

  </div>
</template>
<script>

export default {
  created () {
    this.$api.get('/front/users', null, r => {
      console.log('个人信息', r)
      this.userInfo = r.data.list[0]
      this.isShop = r.data.list[0].isShop
      if(this.isShop === '是') {
        this.isShop = false
      } else {
        this.isShop = true
      }
    })
    this.$api.get('/front/orders/count', null, r => {
      console.log('订单统计', r)
      this.fukuan_num = r.data[0]
      this.fahuo_num = r.data[1]

      this.shouhuo_num = r.data[2]
      this.pingjia_num = r.data[3]
      if(this.fukuan_num === 0) {
        this.fukuan_num_show = false
      }
      if(this.fahuo_num === 0) {
        this.fahuo_num_show = false
      }
      if(this.shouhuo_num === 0) {
        this.shouhuo_num_show = false
      }
      if(this.pingjia_num === 0) {
        this.pingjia_num_show = false
      }
    })
  },
  data () {
    return {
      userInfo: {},
      src: this.$src,
      fukuan_num: 0,
      fahuo_num: 0,
      shouhuo_num: 0,
      pingjia_num: 0,
      fukuan_num_show: true,
      fahuo_num_show: true,
      shouhuo_num_show: true,
      pingjia_num_show: true,
      isShop: true,
    }
  },
  methods: {
    tuichu: function () {
      this.$api.get('/front/base/logout', null, r => {
        console.log('退出r', r)
        let instance = Toast(r);
        setTimeout(() => {
          this.$router.replace({ path: '/login' })
        }, 2000)
      })
    }
  }
}
</script>

<style>
</style>
